9298
16221
أود عرض عناصر تنتمي إلى عملاء مختلفين. لهذا الغرض ، أقوم بجلب البيانات من خلال مكالمة ajax وبعد ذلك أقوم بتجميع البيانات بناءً على كل عميل فريد. ثم أقوم بإلحاق البيانات المجمعة بـ html الخاص بي.
يبدو هيكل بياناتي المجمعة كما يلي:
"فلان الفلاني": [
{
"Item_id": 1
"اسم_العنصر": "abc"
} ،
{
"معرف العنصر": 2
"Item_name": "def"
} ،
] ،
"جين دو":
{
"معرف العنصر": 3
"اسم_العنصر": "غي"
} ،
{
"معرف العنصر": 4
"اسم_العنصر": "jkl"
} ،
]
يبدو الرمز الخاص بي كما يلي:
$ .each (groupedData، function (key، value) {
$ ('. cust_items'). append (`.

`+ مفتاح +` <رأس>
رقم البند اسم العنصر
`) ؛ $ .each (value، function (ky، val) { $ ('# dataTable tbody'). append ( ` "+ ky +` "+ val.Item_name +` `) ؛ }) ؛ }) ؛ أواجه مشكلة حيث يتم عرض جميع العناصر أسفل العميل الأول أثناء عرض البيانات بشكل صحيح تحت العميل الثاني.

تفتقد الفواصل بعد عدم وضع الخصائص وكائنات خاصية Jane Doe في []. ضع في اعتبارك تغيير كائن البيانات المجمعة لأن بناء الجملة ليس صحيحًا.
تحرير: ضبط سلسلة القالب أيضًا والوصول إلى الجدول باستخدام المعرف الديناميكي أيضًا.
عينة:
السماح للبيانات المجمعة = {
"فلان الفلاني": [{
"Item_id": 1 ،
"اسم_العنصر": "abc"
} ،
{
"معرف العنصر": 2 ،
"Item_name": "def"
}
] ،
"جين دو": [{
"Item_id": 3 ،
"اسم_العنصر": "غي"
} ،
{
"معرف_العنصر": 4 ،
"اسم_العنصر": "jkl"
}
]
} ؛
$ .each (groupedData، function (key، value) {
$ ('. cust_items'). append (`.

$ {key}

<رأس>
رقم الصنف اسم العنصر
`) ؛ $ .each (value، function (ky، val) { $ (`#dataTable _ $ {key.split ('') .join ('_')} tbody`). append ( ` $ {ky} $ {val.Item_name} `) ؛ }) ؛ }) ؛
| لقد تأخرت قليلاً عن الحفلة ، ولكن إليك طريقة ممتعة وعملية لعرض بياناتك ديناميكيًا باستخدام عنصر